<!DOCTYPE html>
<html>

<head>
    <meta name="viewport"
        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="css/example.css?v=1.0" />
    <link rel="stylesheet" type="text/css" href="css/weui.min.css?v=1.0" />
    <link rel="stylesheet" type="text/css" href="css/element-ui.css" />
    <link rel="stylesheet" type="text/css" href="css/vant.min.css" />
    <link rel="stylesheet" type="text/css" href="css/swiper-bundle.min.css" />
    <link rel="stylesheet" type="text/css" href="css/public.css?v=5.0" />
    <link rel="stylesheet" type="text/css" href="css/listLook.css?v=7.0.1" />
    <link rel="stylesheet" type="text/css" href="css/seekList.css?v=1.0.3" />
    <title>关爱</title>
</head>

<body>
    <div id="main" style="padding: 10px;">
        <!-- 头部搜索框 -->
        <div class="ub-search">
            <div class="ub-input">
                <img src="images/placeSearch.png" alt="">
                <input type="text" placeholder="请输入搜索内容" v-model.trim="searchVal" @change="searchChange">
                <div class="ub-search_button" @click="search">
                    <span v-show="!searchLoading">搜索</span>
                    <i v-show="searchLoading" class="el-icon-loading"></i>
                </div>
            </div>
        </div>
        <!-- 新增 -->
        <div class="ub-add">
            <el-button type="primary" icon="el-icon-edit" @click="add">新增</el-button>
        </div>
        <!-- 公告 -->
        <div class="swiper mySwiper" v-if="announcementList.length !=0">
            <div class="swiper-wrapper" @click="goAnnouncementCareRecords($event)">
                <div class="swiper-slide" v-for="item in announcementList" :key="item.id">
                    <img src="images/megaphone.png" alt="">
                    <div class="ub-con">
                        <span style="color: #F56C6C;" v-cloak>{{item.realname}}</span>
                        <span style="color: #E6A23C;" v-cloak v-if="item.frequency==1">入户探访1次</span>
                        <span style="color: #E6A23C;" v-cloak v-if="item.frequency==2">电话探访1次</span>
                        <span style="color: #E6A23C;" v-cloak v-if="item.frequency==3">入户+电话探访1次</span>
                        <span>未走访</span>
                    </div>
                    <div class="ub-go" :data-uuid="item.id" :data-frequency="item.frequency"
                        :data-last_care_status="item.last_care_status" :data-last_care_id="item.last_care_id">去关爱->
                    </div></span>
                </div>
            </div>
        </div>
        <div class="ub-seekPeopleList-zfl" style="">
            <div class="ub-times_people">
                <span style="color: #409EFF ;" v-cloak>{{total}}</span>人
            </div>
            <div class="ub-times_people" v-cloak style="background:transparent">
                <span style="display: flex;">
                    <span class="ub-pl_in_select">
                        <select name="year" id="year" v-model="year" @change="changeYear">
                            <option :value="item" v-for="item in yearArr" :key="item" v-cloak>
                                {{item}}
                            </option>
                        </select>
                    </span>
                    <span class="ub-pl_in_c">
                        <span class="ub-pl_text1" @click="changeRate(-1)">&lt;</span>
                        <span class="ub-pl_text2" v-cloak style="font-size:10px;">第{{week}}周走访率:{{care_rate}}%</span>
                        <span class="ub-pl_text1" @click="changeRate(1)">></span>
                    </span>
                </span>
            </div>
        </div>

        <!-- tab -->
        <div class="ub-times">
            <div class="ub-seektab">
                <div :class="{active:tabIndex==1}" @click="changeTab(1)">
                    入户探访1次
                </div>
                <div :class="{active:tabIndex==2}" @click="changeTab(2)">
                    电话探访1次
                </div>
                <div :class="{active:tabIndex==3}" @click="changeTab(3)">
                    入户+电话探访1次
                </div>
            </div>

        </div>

        <!-- 老人 -->
        <div v-cloak class="ub-seek_pbox">
            <div v-cloak class="ub-seek_pitem"
                @click="goCareRecords($event, item.id,item.last_care_id,item.last_care_status)"
                v-for="(item,index) in list" :key="index">
                <img src="images/listIcon15.png" alt="">
                <div class="ub-seek_con">
                    <p v-cloak>
                        {{item.realname}}
                        <span style="color: #206DFF;"
                            v-if="item.last_care_time && item.last_care_status==1">(已走访)</span>
                        <span style="color: rgb(230, 162, 60);"
                            v-if="tabIndex==3 && item.last_care_status==0">(待提交)</span>
                    </p>
                    <p v-cloak v-if="item.last_care_time">
                        <span style="font-size: 12px;">{{item.last_care_time}}(第{{item.last_care_week}}周)</span>
                    </p>
                    <p></p>
                </div>
                <div class="ub-lookBth" data-type="care">关爱</div>
            </div>
            <el-empty description="暂无数据" v-show="list.length==0"></el-empty>
        </div>
    </div>
    <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jweixin-1.6.0.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/element-ui.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/vant.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/swiper-bundle.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jwt-decode.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/cHttp.js?v=1.0.0" type="text/javascript" charset="utf-8"></script>
    <script src="js/wxPublic.js?v=15.0.0" type="text/javascript" charset="utf-8"></script>
    <script src="js/seekPeopleList.js?v=1.0.15" type="text/javascript" charset="utf-8"></script>

</body>

</html>